﻿@using BlockMain_Class

@{
    Layout = "/Views/Shared/_Layout.cshtml";
    var model = (info)Model;
    var index = 1;
}

<style type="text/css">
    * {
        margin: 0;
        padding: 0;
    }

    input, button, a {
        outline: none;
    }

    html, body {
        height: 100%;
    }

    .bgimg {
        height: 100%;
        width: 100%;
        background: url(/assets/images/all.png) no-repeat;
    }
    /*侧边栏*/
    .left {
        width: 4%;
        height: 100%;
        background-color: #32323a;
        float: left;
    }

        .left .logo {
            background-color: #393941;
            height: 55px;
            width: 100%;
            background-image: url(/assets/images/logo_1.png);
            background-repeat: no-repeat;
            background-size: 80%;
            background-position: 5px;
        }
    /*公链展示*/
    .right {
        width: 96%;
        height: 100%;
        float: left;
        color: white;
    }

        .right .top {
            height: 55px;
            width: 100%;
            background-color: rgba(6,142,220,0.9);
            font-size: 16px;
        }

            .right .top img {
                margin-right: 10px;
            }

            .right .top .user {
                width: 145px;
                height: 100%;
                float: left;
                margin-left: 60px;
                line-height: 55px;
            }

            .right .top .checkout {
                width: 105px;
                height: 100%;
                float: right;
                margin-right: 40px;
                line-height: 55px;
            }
        /*内容*/
        .right .middle .contant {
            width: 90%;
            margin: 30px auto 0;
        }

            .right .middle .contant .title {
                border-bottom: 3px solid rgb(6,142,220);
                padding-bottom: 5px;
                font-size: 26px;
                width: 140px;
                color: white;
                font-weight: bold;
                margin-bottom: 10px;
                text-align: center;
            }

    .search {
        width: 100%;
        height: 28px;
    }

    .searchleft {
        float: left;
        width: 500px;
    }

        .searchleft .input {
            width: 100%;
            font-size: 16px;
        }

    .searchright {
        float: right;
        width: 200px;
    }

        .searchright .type {
            width: 100%;
            font-size: 16px;
        }
    /*新建任务*/
    @@media screen and (max-height: 940px) {
        .project {
            height: 220px;
        }
    }

    @@media screen and (min-height: 941px) {
        .project {
            height: 310px;
        }
    }

    .project {
        overflow: scroll;
        overflow-x: hidden;
        width: 100%;
    }

        .project::-webkit-scrollbar { /*滚动条整体样式*/
            width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
            height: 4px;
        }

        .project::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
            border-radius: 5px;
            -webkit-box-shadow: inset 0 0 5px rgba(255,255,255,0.2);
            background: rgba(255,255,255,0.2);
        }

        .project::-webkit-scrollbar-track { /*滚动条里面轨道*/
            -webkit-box-shadow: inset 0 0 5px rgba(255,255,255,0.2);
            border-radius: 0;
            background: rgba(255,255,255,0.2);
        }

        .project .same {
            margin-top: 20px;
            width: 100%;
        }

            .project .same:first-child {
                margin-top: 0px;
            }

            .project .same .head {
                height: 53px;
                width: 100%;
                background-color: rgba(49,49,60,0.8);
                border-radius: 10px 10px 0 0;
                line-height: 53px;
            }

                .project .same .head .number {
                    height: 35px;
                    width: 35px;
                    background-color: rgb(6,142,220);
                    text-align: center;
                    border-radius: 5px;
                    font-size: 16px;
                    line-height: 35px;
                    float: left;
                    position: relative;
                    top: 8px;
                    left: 40px;
                }

            .project .same .inform {
                /*height: 267px;*/
                width: 100%;
                background-color: rgba(64,62,79,0.8);
                border-radius: 0px 0px 10px 10px;
                padding: 30px 0px 0 50px;
                font-size: 16px;
            }

        .project:last-child {
            border-radius: 10px;
        }

        .project table {
            width: 100%;
            height: 100%;
            font-size: 16px;
        }

            .project table tr:nth-child(even) {
                background-color: rgba(64,62,75,0.8);
            }

            .project table tr:nth-child(odd) {
                background-color: rgba(48,47,57,0.8);
            }

            .project table tr {
            }

                .project table tr td {
                    text-align: center;
                    padding: 10px 20px;
                }

    .inform > div {
        margin-bottom: 10px;
    }

    .qualified {
        width: 300px;
        height: 35px;
    }

        .qualified div {
            float: left;
        }

        .qualified .select {
            width: 135px;
            height: 100%;
            line-height: 35px;
            text-align: center;
            margin-left: 8px;
        }

        .qualified .yes {
            background-color: #06a4fc;
            height: 100%;
            width: 50%;
            border-radius: 5px 0px 0px 5px;
        }

    .contrary-yes {
        border: 1px solid #ff455f;
        height: 100%;
        width: 50%;
        border-radius: 5px 0px 0px 5px;
    }

    .qualified .no {
        border: 1px solid #06a4fc;
        height: 100%;
        width: 50%;
        border-radius: 0px 5px 5px 0px;
    }

    .contrary-no {
        background-color: #ff455f;
        height: 100%;
        width: 50%;
        border-radius: 0px 5px 5px 0px;
    }

    .up {
        width: 400px;
        height: 35px;
        margin-top: 20px;
        float: left;
    }

        .up a {
            color: white;
            text-decoration: none;
        }

    .post {
        width: 220px;
        height: 35px;
        background-color: #06a4fc;
        float: right;
        margin-top: 20px;
        line-height: 35px;
        text-align: center;
        border-radius: 5px;
        font-size: 16px;
        cursor: pointer;
    }

    .display {
        display: none;
    }
</style>


<body>
    <div class="bgimg">
        <div class="left">
            <div class="logo"></div>
        </div>
        <div class="right">
            <div class="top">
                <div class="user">
                    <img class="user-img" src="/assets/images/touxiang.png" />
                    <span class="txt">欢迎登录</span>
                </div>
                <div class="checkout">
                    <img class="checkout-img" src="/assets/images/fytuichu.png" />
                    <span class="txt" onclick="LoginOut()">退出</span>
                </div>
            </div>
            <div class="middle">
                <div class="contant">
                    <div class="title">
                        入链详情
                    </div>
                    <div class="search">
                        <div class="searchleft">
                            <div class="input">
                                <label>送检单位：<span>@(model.Mechanism)</span></label>
                            </div>
                        </div>
                        <div class="searchright">
                            <div class="type">
                                <label>
                                    <div style="float: left;">检测类型：</div>
                                    <span>@(model.Type == 0 ? "实验室" : model.Type == 1 ? "电站" : "监造")</span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="project">
                        @foreach (var item in model.ProjecItem)
                        {
                            <div class="same">
                                <div class="head">
                                    <div class="number">
                                        @index
                                    </div>
                                </div>
                                <div class="inform">
                                    <div class="pro">
                                        <label style="font-weight:normal">
                                            检测项目：
                                            <span>@item.Name</span>
                                        </label>
                                    </div>
                                    <div class="pro">
                                        <label style="font-weight:normal">
                                            是否合格：
                                            <span>@(item.IsQualified ? "合格" : "不合格")</span>
                                        </label>
                                    </div>
                                    <div class="pro">
                                        <label style="font-weight:normal">
                                            完成时间：
                                            <span>@item.SuceessTime</span>
                                        </label>
                                    </div>

                                    @*
                                          <div class="qualified">
                                              <div class="txt">
                                                  是否合格：<span>@(item.IsQualified?"合格":"不合格")</span>
                                              </div>
                                              <div class="select">
                                                <div class="@(item.IsQualified?"yes":"contrary-yes")">
                                                    合格
                                                </div>
                                                <div class="@(item.IsQualified?"no":"contrary-no")">
                                                    不合格
                                                </div>
                                              </div>
                                        </div>
                                        <div class="input-daterange time">
                                            完成时间：
                                            <span>@item.SuceessTime</span>
                                        </div>*@
                                </div>
                            </div>
                            index++;
                        }
                    </div>
                    <div class="submit">
                        <div class="up">
                            <div class="" style="float: left;">
                                报告原件：
                            </div>
                            <a href="@(model.FilePath)" download="download">@(model.FilePath != null ? "点击下载" : "未上传")</a>
                        </div>
                        <div class="post look" onclick="getspeed(this)">
                            查看进度
                        </div>
                        @*<div class="post reflash display">
                                刷新进度
                            </div>*@
                    </div>
                    <div class="prog display" style="display: none" id="speed">
                        <div class="title">
                            入链进度
                        </div>
                        <div class="project">
                            <table id="speedtable"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>


<script>
    $(".look").click();

    function getspeed(btn) {
        $(btn).text("刷新中...");
        $.ajax({
            type: "POST",
            url: "/Show/GetSpeed?rid=@(model.rid)",
            dataType: "json",
            success: function (msg) {
                //处理json
                var str = "";
                $.each(msg, function (n, value) {
                    var num = parseInt(n) + parseInt(1);
                    str += "<tr><td>" + +num + "</td><td>" + value.detail + "</td>";
                })
                $("#speed").show();
                $("#speedtable").html(str);
                setTimeout(function () {
                    $(btn).text("刷新进度");
                }, 1000);
                //alert(str);

            }
        });
    }
</script>
